/* =Mobile Menu
-------------------------------------------------------------- */

#header-mobile-menu { 
	float: right; 
	display: none; 
}
#secondary-mobile-menu {
    display: none;
}
.mobile-menu-bar {
	color: #757575;
    display: block;
    height: 20px;
    width: 31px;
	text-align: center;
}
.mobile-menu-bar:hover {
	color: #7c9b30;
}
.fixed-header .mobile-menu-bar:before {
	top: -6px;
}
.mobile-menu {
	position: fixed; 
	left: 0; 
	top: 40px;
	padding: 5%; 
	background: #fff; 
	width: 90%; 
	visibility: visible; 
	opacity: 1; 
	overflow-x: scroll;
	display: none; 
	z-index: 9999;
	border-top: 3px solid #7c9b30; 
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
	-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
	bottom: 0;
}
.admin-bar .mobile-menu { 
	top: 71px; 	
}
.mobile-menu li a { 
	font-size: 14px; 
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out; 
	transition: all 0.2s ease-in-out; 
	
	border-bottom: 1px solid #f8f8f8;
	color: #666;
	padding: 10px 5%;
	width: 90%; 
	display: block;
}
.mobile-menu li a:hover { 
	color: #111; 
	background-color: #f8f8f8; 
	text-decoration: none; 
}
.mobile-menu li ul {
    display: block !important;
    padding-left: 10px;
    visibility: visible !important;
}
.mobile-menu li li { 
	padding-left: 5%;
}
.mobile-menu .menu-item-has-children > a {
    font-weight: bold;
}


/* =Screen Size Max 1344px
-------------------------------------------------------------- */
@media screen and (max-width: 1344px) {
	.container {
		width: 1160px;
	}
	#primary {
		width: 770px;		
	}	
}


/* =Screen Size Max 1280px
-------------------------------------------------------------- */
@media screen and (max-width: 1280px) {
	.container {
		width: 1080px;
	}
	#primary {
		width: 690px;
	}
}


/* =Screen Size Max 1152px
-------------------------------------------------------------- */
@media screen and (max-width: 1152px) {
	.container {
		width: 960px;
	}
	#primary {
		width: 570px;
	}
}


/* =Screen Size Max 1024px
-------------------------------------------------------------- */
@media screen and (max-width: 1024px) {
	.container {
		width: 920px;
	}
	#primary {
		width: 530px;		
	}	
	#secondary-menu ul.menu a {
		line-height: 40px;		
		line-height: 4rem;
		padding: 0 10px;		
	}	
	.header-sidebar .widget ul.menu ul, 
	#secondary-menu ul.menu ul	{
		top: 40px;
		width: 188px;
	}	
	.header-sidebar .widget ul.menu ul a, 
	#secondary-menu ul.menu ul a {
		padding: 5px 10px;
	}	
	/* Font Sizes */
	body,
	button,
	input,
	select,
	textarea,
	#homepage-message p {
		font-size: 13px;
		font-size: 1.3rem;
	}	
	#site-title,
	#slider-nav .slide-previous:before,
	#slider-nav .slide-next:before {
		font-size: 22px;
		font-size: 2.2rem;	
	}	
	#main-slider .entry-header .entry-title,
	.entry-header .entry-title, 
	#featured-heading h2,
	#homepage-message .right-section a, 
	#featured-post #feature-heading,
	.comments-title,
	#reply-title,
	.entry-content h2,
	.comment-content h2 {
		font-size: 18px;
		font-size: 1.8rem;
	}	
	#homepage-message h2, 
	.widget-title {
		font-size: 16px;
		font-size: 1.6rem;		
	}
	.entry-content h1,
	.comment-content h1 {
		font-size: 22px;
		font-size: 2.2rem;
	}
	.entry-content h3,
	.comment-content h3 { 
		font-size: 16px;
		font-size: 1.6rem;
	}
	.entry-content h4,
	.comment-content h4 { 
		font-size: 15px;
		font-size: 1.5rem;
	}
	#main-slider .entry-content,
	.entry-content h5,
	.comment-content h5 { 
		font-size: 14px;
		font-size: 1.4rem;
	}
	.entry-content h6,
	.comment-content h6 { 
		font-size: 13px;
		font-size: 1.3rem;
	}	
	#homepage-message .right-section a {
		padding: 5px 20px;	
	}	
}


/* =iPad Landscape
-------------------------------------------------------------- */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/*@media screen and (max-width: 1000px) { */
	.container {
		width: 960px;
	}	
	#primary {
		width: 570px;
	}		
}


/* =Screen Size Max 980px
-------------------------------------------------------------- */
@media screen and (max-width: 980px) {	
	.container {
		width: 720px;
	}
	#primary, 
	#site-generator .copyright,
	#site-generator .powered {
		width: 100%;
	}
	#header-right .widget {
		display: none;
	}
	#homepage-message .left-section {
		width: 540px;	
	}	
	#masthead.fixed-header #header-left {
		padding-bottom: 0;
	}	
	#homepage-message .right-section {
		width: 150px;
	}
	#featured-post.layout-four .featued-content-wrap,
	#featured-post.layout-three .featued-content-wrap{
		margin-left: -30px;
	}	
	#featured-post.layout-four .post,
	#featured-post.layout-three .post {
		margin-left: 30px;
		width: 345px;
	}
	#featured-post.layout-four .post:nth-child(2n+1),
	#featured-post.layout-three .post:nth-child(2n+1),
	#secondary .widget:nth-child(2n+1) {  
		clear: both;
	}
	#featured-post.layout-three .post:nth-child(3n+1) {
		clear: none;
	}
	#primary {
		border-bottom: 1px solid #eee;
		margin-bottom: 30px;
	}	
	#secondary {
		margin-left: -30px;
		width: 750px;
	}
	#secondary .widget {
		display: inline;
		float: left;
		margin-left: 30px;
		padding: 20px;
		width: 305px;
	}
	#secondary .widget.widget_adventurous_social_widget {
		padding: 10px 11px 5px;
	}	
	#site-generator .powered {
		padding-top: 5px;		
	}	
	#hgroup-wrap img {
		display: inline-block;
	}
	#header-right,
	.fixed-header #header-right {
   		padding-top: 0;		
	}	
	.header-sidebar .menu, 
	.header-sidebar .widget_text {
		float: none;
		text-align: center;
	}
	#header-right #header-search-widget {
		padding: 0;
	}
	#supplementary.four .widget-area {
		width: 48%;
		margin-left: 4%;
	}	
	#supplementary.four #third.widget-area {
		clear: both;
		margin-left: 0;
	}
	#site-generator .site-info {
		font-size: 12px;
		font-size: 1.2rem;
		padding: 20px 0;
	}
	#site-generator .copyright,
	#site-generator .powered {
		text-align: center;		
	}
	#masthead,
	#masthead.fixed-header {
		padding-top: 6px;
		padding-bottom: 4px;
		min-height: 29px;
	}
	#header-left {
		padding-bottom: 0;
	}
	#site-title,
	#masthead.fixed-header #site-title {
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.1;
	}
	#site-description,
	#masthead.fixed-header #site-description{
		font-size: 11px;
		font-size: 1.1rem;
		line-height: 1;
	}
	#masthead #site-logo img,
	#masthead.fixed-header #site-logo img {
		max-height: 28px;
		max-width: 100%;
	}
	#header-left {
		width: 85%;
	}
	#header-right {
		width: 15%;
	}
	#header-right .header-search-wrap,
	.fixed-header #header-right .header-search-wrap {
		top: 33px;
	}
	.fixed-header #hgroup.logo-enable {
		display: none;
	}	
	/* Menu */
	#header-mobile-menu {
		display: block;
	}
	#secondary-mobile-menu {
		display: inline-block;
		float: left;
		margin-right: 5px;
	}
	#header-right .widget_nav_menu,
	#secondary-menu {
		display: none;
	}	
	.header-sidebar .widget.widget_nav_menu {
		width: 100%;
	}
	.widget.widget_nav_menu .sb-holder {
		background-color: #21759b;
		color: #fff;
		clear: both;
		display: block;
		width: 100%;
	}
	.widget.widget_nav_menu .sb-holder a,
	.widget.widget_nav_menu .sb-holder a:hover {
		color: #fff;
	}	
	a#scrollup {
		font-size: 20px;
		padding: 3px;
	}		
}


/* =iPad Portrait
-------------------------------------------------------------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	.container {
		width: 710px;
	}	
	#homepage-message .left-section {
		width: 550px;
	}
	.featued-content-wrap,
	#secondary {
		width: 740px;	
	}
	#featured-post.layout-four .post,
	#featured-post.layout-three .post {
		width: 340px;
	}
	#secondary .widget {
		padding: 20px;
		width: 300px;
	}	
}


/* =Screen Size Max 782px
-------------------------------------------------------------- */
@media screen and (max-width:782px) {
	.admin-bar #masthead.fixed-header {
		top: 46px;
	}
	.admin-bar .mobile-menu { 
		top: 85px; 
	}
}


/* =Screen Size Max 767px
-------------------------------------------------------------- */
@media screen and (max-width: 767px) {	
	.container {
		width: 600px;
	}
	#featured-post, 
	#content-sidebar, 
	#footer-sidebar	{
		padding-top: 20px;
	}
	#content article, 
	#secondary .widget, 
	#comments {
		padding: 20px;
	}	
	.hentry,
	.comments-area article,
	#homepage-message { 
		padding-bottom: 20px;
	}	
	#homepage-message {
		padding: 20px 0;
	}
	#main-slider .entry-header .entry-title {
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: normal;
	}
	#main-slider .entry-container .entry-content {
		display: none;
	}
	#homepage-message .left-section	{
		width: 430px;
	}
	#featured-post {
		padding-bottom: 0;
	}
	#featured-post.layout-four .featued-content-wrap,
	#featured-post.layout-three .featued-content-wrap {
		margin-left: -20px;
		width: 620px;
	}	
	#featured-post.layout-four .post,
	#featured-post.layout-three .post {
		margin-left: 20px;
		width: 290px;
	}
	#featured-heading {
		padding-bottom: 10px;
		width: 90%;
	}
	#primary,
	.page-links,
	.widget,
	blockquote,
	#content article,
	#content .site-navigation,
	#content .author-info,
	#infinite-handle,
	#comments,
	.hentry.sticky .featured-sticky,
	.page-header,
	.entry-header,
	p,
	.featured-image,
	.entry-content table,
	.comment-content table,
	#content .searchform,
	.page-link,
	.single-attachment .entry-attachment img,
	#reply-title,
	.comments-title,
	.mejs-container,
	.breadcrumb {
		margin-bottom: 20px;
	}
	#secondary {
		margin-left: -20px;
		width: 620px;
	}
	#secondary .widget {
		margin-left: 20px;
		width: 250px;
	}
	#content .hentry, 
	#secondary .widget,
	#comments {
		padding: 20px;
	}
	#main-slider .entry-header {
		margin-bottom: 0;
	}
	#slider-nav a {
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.4;
		padding: 0 5px;
	}
	.entry-header .entry-title,
	#homepage-message,
	.comments-title, #reply-title {
		font-size: 16px;
		font-size: 1.6rem;
	}
	.commentlist .children {
		margin-left: 0;
	}	
	.woocommerce #content ul.products li {
		margin-right: 0;
		width: 100%;
	}
	.woocommerce #content .product a.added_to_cart {
		clear: both;
		display: block;
	}
	#main .woocommerce .col-1,
	#main .woocommerce .col-2 {
		width: 100%;
	}
}	


/* =Screen Size Max 640px
-------------------------------------------------------------- */
@media screen and (max-width: 640px) {
	.container {
		width: 520px;
	}
	#hgroup.logo-enable {
		display: none;
	}
	#homepage-message .left-section {
		width: 360px;
	}	
	#homepage-message .right-section {
		width: 140px;
	}	
	#homepage-message .right-section a {
		display: inline-block;
		margin: 0 auto;
	}
	#featured-post.layout-four .featued-content-wrap, 
	#featured-post.layout-three .featued-content-wrap,
	#secondary {
		width: 540px;			
	}
	#featured-post.layout-four .post,
	#featured-post.layout-three .post {
		width: 250px;
	}	
	#secondary .widget {
		width: 210px;
	}
	.entry-header .entry-title, 
	#homepage-message h2, 
	#homepage-message .right-section a, 
	#featured-post #feature-heading {
		font-size: 16px;		
		font-size: 1.6rem;
	}	
} 


/* =Screen Size Max 600px
-------------------------------------------------------------- */
@media screen and (max-width:600px) {
	.admin-bar #masthead.fixed-header {
		top: 0;
	}
	.admin-bar #masthead.fixed-header .mobile-menu {
		top: 40px;
	}

}


/* =Screen Size Max 560px
-------------------------------------------------------------- */
@media screen and (max-width: 560px) {
	.container {
		width: 400px;
	}
	#homepage-message .left-section,
	#homepage-message .right-section {
		width: 100%;
	}
	#homepage-message .left-section,
	#homepage-message .left-section h2 {
		padding-bottom: 10px;
	}
	#featured-post.layout-four .featued-content-wrap, 
	#featured-post.layout-three .featued-content-wrap,
	#featured-post.layout-four .post,
	#featured-post.layout-three .post,
	#secondary {
		margin-left: 0;
		width: 100%;
	}	
	#secondary .widget {
		margin-left: 0;
		padding: 10px 4%;
		width: 91%;
	}
}


/* =iPhone 5 in landscape
-------------------------------------------------------------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) {
	.container {
		width: 520px;
	}
	#homepage-message .left-section {
		padding: 0;
		width: 390px;
	}	
	#homepage-message .right-section {
		width: 110px;
	}	
	#featured-post.layout-four .featued-content-wrap, 
	#featured-post.layout-three .featued-content-wrap,
	#secondary {
		margin-left: -20px;
		width: 540px;
	}
	#featured-post.layout-four .post,
	#featured-post.layout-three .post {
		margin-left: 20px;
		width: 250px;
	}	
	#secondary .widget {
		margin-left: 20px;
		padding: 20px;
		width: 210px;
	}
	input[type="text"],
	input[type="email"],
	input[type="url"],
	input[type="password"],
	textarea {
		padding: 10px;
		width: 90%;
	}	
}


/* =Screen Size Max 480px
-------------------------------------------------------------- */
@media screen and (max-width: 480px) {
	.container {
		width: 400px;
	}	
	#header-left {
		width: 80%;
	}
	#header-right {
		width: 20%;
	}	
	#homepage-message .left-section,
	#homepage-message .right-section {
		width: 100%;
	}
	#homepage-message .left-section,
	#homepage-message .left-section h2 {
		padding-bottom: 10px;
	}
	#featured-post.layout-four .featued-content-wrap, 
	#featured-post.layout-three .featued-content-wrap,
	#featured-post.layout-four .post,
	#featured-post.layout-three .post,
	#secondary {
		margin-left: 0;
		width: 100%;
	}	
	#secondary .widget {
		margin-left: 0;
		padding: 10px 4%;
		width: 91%;
	}	
	#header-left {
		width: 82%;
	}
	#header-right {
		width: 18%;
	}	
	#slider-nav .slide-previous:before,
	#slider-nav .slide-next:before {
	  font-size: 16px;
	}
	#footer-sidebar #supplementary .widget-area {
		width: 100%;
	}
}


/* =Screen Size Max 479px
-------------------------------------------------------------- */
@media screen and (max-width: 479px) {
	.container {
		width: 360px;
	}	
}


/* =Screen Size Max 400px
-------------------------------------------------------------- */
@media screen and (max-width: 400px) {
	.container {
		width: 320px;
	}	
}


/* =Screen Size Max 360px
-------------------------------------------------------------- */
@media screen and (max-width: 360px) {
	.container {
		width: 94%;
	}	
	#header-left {
		width: 75%;
	}
	#header-right {
		width: 25%;
	}	
}